.normal-theme {
  .common-card {
    width: 100%;
    background: #ffffff;
    -webkit-box-shadow: 0 4rem 4rem 0 rgb(65 120 170 / 18%);
    box-shadow: 0 4rem 4rem 0 rgb(65 120 170 / 18%);
    border-radius: 6rem;
    &.active {
      background-color: #0981e4;
    }
  }
  .common-title {
    color: #0e64b0;
    font-size: 15rem;
    border-left: 4.2rem solid #005bac;
    padding: 0 6rem;
    margin: 6rem 0 10rem;
    &.active {
      border-left: 0rem solid #005bac !important;
      color: #fff;
    }
  }
  #app {
    background-color: none;
  }
}
.el-collapse-item__content{
  padding: 8px;
}
.take-care {
  padding: 10px;
  background-color: #0e1b36;
  margin-bottom: 20px;
}
.p1 {
  background-color: #5a5454;
  padding: 10px;
}
.dark-theme {
  .common-card {
    width: 100%;
    background: none !important;
    box-shadow: 0 4rem 4rem 0px rgba(65, 120, 170, 0.18);
    border-radius: 6rem;
    border: 1rem solid #004787;
    &.active {
      background-color: #001c58 !important;
    }
  }
  .params-box {
    * {
      color: #fff;
    }
  }
  .el-dialog,
  .el-pager li {
    background-color: #030540;
  }
  .el-input-group__append,
  .el-input-group__prepend,
  .el-select-dropdown,.el-picker-panel,.el-picker-panel__footer,.el-time-panel,.el-radio-button__inner {
    background-color: #030540;
  }
  .el-picker-panel__body{
    .available,th,.el-date-picker__header button,.el-date-picker__header span{
      color: #fff;
    }
  }
  .el-time-spinner__item{
    color: #fff;
    &.active{
      color: #409eff;
    }
    &:hover{
      color: #409eff;
    }
  }
  .el-time-panel__btn.cancel{
    color: #fff;
  }
  .el-date-picker__header button:hover,.el-date-picker__header span:hover{
    color: #409eff;
  }
  .el-time-spinner__item:hover:not(.disabled):not(.active){
    background-color: #535593;
  }
  .el-date-table__row{
    &.current{
      .available div{
        background-color: #535593;
      }
    }
  }
  .el-month-table td .cell,.el-year-table td .cell{
    color: #fff;
    &:hover{
      color: #409eff;
    }
  }
  .el-date-table td.in-range div:hover{
    background-color: #535593;
  }
  .el-date-table.is-week-mode .el-date-table__row:hover div{
    background-color: #535593;
  }
  .el-date-table.is-week-mode .el-date-table__row:hover td.available:hover{
    color: #409eff;
  }
  .icon-ul li:hover {
    background-color: #6968ab;
  }
  .el-select-dropdown__item {
    color: #fff;
    &.hover {
      color: #333;
    }
    &.selected {
      color: #409eff;
    }
  }
  .el-popover {
    background-color: #030540;
    * {
      color: #fff;
    }
  }
  .el-switch__core {
    background-color: transparent;
  }

  .el-button--default,
  .el-input-number__decrease,
  .el-input-number__increase,
  .el-color-picker__panel {
    background-color: #030540;
    color: #fff;
  }
  .icon-ul li.active-item,
  .icon-ul li:hover {
    background-color: #425078 !important;
  }

  .el-button--primary {
    background-color: #409eff;
  }
  .el-collapse-item__wrap,
  .el-collapse-item__content {
    background-color: transparent;
    color: #fff;
  }
  .el-collapse-item__header {
    background-color: #888ca1;
    padding: 0 10px;
  }
  .head-tools {
    .save {
      color: #fff;
      text-shadow: 0 0 5px white, 0 0 10px #00ffff, 0 0 15px #7fff00,
        0 0 20px white;
    }
    .drag {
      color: #edff5c;
      text-shadow: 0 0 5px white, 0 0 10px #00ffff, 0 0 15px #7fff00,
        0 0 20px white;
    }
    .export {
      color: #5cffff;
      text-shadow: 0 0 5px white, 0 0 10px #00ffff, 0 0 15px #7fff00,
        0 0 20px white;
    }
    .model {
      color: #fff;
      text-shadow: 0 0 5px white, 0 0 10px #00ffff, 0 0 15px #fff,
        0 0 20px #8cb4ff;
    }
    .privew {
      color: #5cffff;
      text-shadow: 0 0 5px white, 0 0 10px white, 0 0 15px #7fff00,
        0 0 20px white;
    }
    .theme {
      color: #5cffff;
      text-shadow: 0 0 5px white, 0 0 10px #00ffff, 0 0 15px #7fff00,
        0 0 20px white;
      &.active {
        color: #fff;
        text-shadow: 0 0 5px white, 0 0 10px #00ffff, 0 0 15px #7fff00,
          0 0 20px white;
      }
    }
    .delete {
      color: red;
      text-shadow: 0 0 10px red, 0 0 20px red, 0 0 30px red, 0 0 40px red;
    }
  }
  .el-form-item__label {
    color: #fff;
  }

  .el-input__inner,
  .el-textarea__inner {
    color: #fff;
    background-color: transparent;
  }
  .el-message-box {
    .el-form-item__label {
      color: #333;
    }
    .el-input__inner,
    .el-textarea__inner {
      color: #333;
      background-color: transparent;
    }
  }
  .common-title {
    color: #cee8ff !important;
    font-size: 15rem;
    border-left: 4.2rem solid #005bac;
    padding: 0 6rem;
    margin: 6rem 0 10rem;
    &.active {
      color: #fff !important;
    }
  }

  #app {
    background-color: #000931;
    background-image: url("../images/dark/bg.jpg");
    background-size: 100% 100%;
    height: 100vh;
  }
}
